<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<span id="s1" class="c1">s1</span>
<label id="l1">l1</label>
<span id="s2" class="c1">s2</span>
<span id="s3" class="c1">s3</span>
<label id="l2" class="c1">l2</label>
<span id="s4">s4</span>
<span id="s5">s5</span>
<hr/>
<button onclick="funA()">获取到ID</button>
<button onclick="funB()">获取到样式</button>
<button onclick="funC()">获取到元素</button>
</body>
</html>
<script>
    function funA() {
        let s4Obj = document.getElementById("s4");
        alert(s4Obj);
    }

    function funB() {
        let c1Attr = document.getElementsByClassName('c1');
        alert(c1Attr);
        alert(c1Attr.length);
    }

    function funC(){
        let spanAttr = document.getElementsByTagName('button');
        alert(spanAttr);
        alert(spanAttr.length);
    }
</script>